import Vue from 'vue'
import VueRouter  from 'vue-router'
// 引入各个组件
import Home from '@/pages/Home.vue'
import About from '@/pages/About.vue'
import News from '@/pages/News.vue'
import Message from '@/pages/Message.vue'
import Detail from '@/pages/Detail.vue'

Vue.use(VueRouter)

// 创建并暴露一个路由器
export default new VueRouter({
  mode:'history',
  routes:[
    {
      name:'guanyu',
      path:'/about',
      component:About
    },
    {
      name:'zhuye',
      path:'/home',
      component:Home,
      children:[
        {
          name:'xinwen',
          path:'news',
          component:News
        },
        {
          name:'xiaoxi',
          path:'message',
          component:Message,
          children:[
            {
              name:'xiang',
              path:'detail',
              component:Detail,
              // props的第一种写法，对象写法，把对象中的一组一组的key-value组合传给Detail
              // props:{a:'哈哈'}

              // props的第二种写法，布尔值写法，把收到的所有的params参数，传给Detail
              // props:true

              // props的第三种写法，函数写法，
              props(route){
                return route.query
              }
            }
          ]
        }
      ]
    },
    {
      path:'/',
      redirect:'/about'
    }
  ]
})
